<template>
	<view style="position: relative;">
		<view class="nav bz p-3 d-flex flex-nowrap a-center" @click="navTo('/pages/my/info/info')">
			<image src="../../static/qian.png" class="user_pic" mode="aspectFill"></image>
			<view class="flex-1 px-2">
				<view class="user_name">微信用户</view>
				<view class="user_phone">13100000000</view>
			</view>
			<view class="d-flex flex-nowrap a-center">
				<image src="/static/code.png" class="code" mode=""></image>
				<view class="user_code">会员码</view>
			</view>
		</view>
		<view class="bz p-2 wrap">
			<view class="bz p-2 bg-white b-radius2">
				<view class="d-flex flex-nowrap a-center j-sb py-2">
					<view class="wrap_title">我的权益</view>
					<view class="wrap_pay" @click="navTo('/pages/my/vip/vip')">立即开通</view>
				</view>
				<view class="py-3 d-flex flex-nowrap a-center">
					<view class="flex-1">
						<image src="/static/order/1.png" class="tag_img" mode=""></image>
						<view class="tagName">下单立享88折</view>
					</view>
					<view class="flex-1">
						<image src="/static/order/2.png" class="tag_img" mode=""></image>
						<view class="tagName">生日积分翻倍</view>
					</view>
					<view class="flex-1">
						<image src="/static/order/3.png" class="tag_img" mode=""></image>
						<view class="tagName">更多专属优惠卷</view>
					</view>
				</view>
			</view>
			<view class="bz p-2 my-2 bg-white b-radius2">
				<view class="py-2 d-flex flex-nowrap a-center">
					<view class="flex-1" @click="navTo('/pages/my/balance/balance')">
						<image src="/static/order/4.png" class="tag_img" mode=""></image>
						<view class="tagName">我的钱包</view>
					</view>
					<view class="flex-1" @click="navTo('/pages/my/gift_card/gift_card')">
						<image src="/static/order/5.png" class="tag_img" mode=""></image>
						<view class="tagName">礼品卡</view>
					</view>
					<view class="flex-1" @click="navTo('/pages/my/goods/goods')">
						<image src="/static/order/6.png" class="tag_img" mode=""></image>
						<view class="tagName">兑换</view>
					</view>
					<view class="flex-1" @click="navTo('/pages/my/integral/integral')">
						<image src="/static/order/7.png" class="tag_img" mode=""></image>
						<view class="tagName">我的积分</view>
					</view>
				</view>
			</view>
			<view class="bz p-2 bg-white b-radius2">
				<view class="py-2 d-flex flex-nowrap a-center">
					<view class="flex-1" @click="navTo('/pages/shop/cart/cart')">
						<image src="/static/order/8.png" class="tag_img" mode=""></image>
						<view class="tagName">购物车</view>
					</view>
					<view class="flex-1" @click="navTo('/pages/shop/orderList/orderList')">
						<image src="/static/order/9.png" class="tag_img" mode=""></image>
						<view class="tagName">订单列表</view>
					</view>
					<view class="flex-1" @click="navTo('/pages/shop/address/address')">
						<image src="/static/order/10.png" class="tag_img" mode=""></image>
						<view class="tagName">地址管理</view>
					</view>
					<view class="flex-1" @click="navTo('/pages/shop/invoice/invoice')">
						<image src="/static/order/11.png" class="tag_img" mode=""></image>
						<view class="tagName">发票抬头</view>
					</view>
					<view class="flex-1" @click="navTo('/pagesA/shop/shop')">
						<image src="/static/order/12.png" class="tag_img" mode=""></image>
						<view class="tagName">我的门店</view>
					</view>
				</view>
			</view>
			
			<view class="bz p-2 bg-white b-radius2 mt-2">
				<view class="list d-flex flex-nowrap a-center" v-for="(item,index) in list" :key="index" @click="navTo(item.url)">
					<image :src="item.img" class="icon" mode=""></image>
					<view class="list_name flex-1 px-2">{{item.name}}</view>
					<image src="/static/3.png" class="right_icon" mode=""></image>
				</view>
			</view>
			<view style="height: 100rpx;"></view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				list:[
					{
						id:1,
						name:'我的签到',
						img:'/static/order/13.png',
						url:'/pages/my/sign/sign'
					},
					{
						id:1,
						name:'我的推广',
						img:'/static/order/14.png',
					},
					{
						id:1,
						name:'加入我们',
						img:'/static/order/15.png',
						url:'/pages/my/jion/jion'
					},
					{
						id:1,
						name:'关于我们',
						img:'/static/order/16.png',
						url:'/pages/my/about/about'
					},
					{
						id:1,
						name:'用户协议',
						img:'/static/order/17.png',
					},
					{
						id:1,
						name:'隐私协议',
						img:'/static/order/11.png',
					}
				]
			}
		},
		methods: {
			navTo(url){
				uni.navigateTo({
					url:url
				})
			}
		}
	}
</script>

<style scoped lang="scss">
.nav{
	width: 750rpx;
	height: 324rpx;
	padding-bottom: 50rpx;
	background: linear-gradient(-38deg, #F0CF9A 0%, #2E4E7E 100%);
	.user_pic{
		width: 105rpx;
		height: 105rpx;
		border-radius: 50%;
	}
	.user_name{
		height: 50rpx;
		line-height: 50rpx;
		font-size: 36rpx;
		font-family: SourceHanSansCN;
		font-weight: 400;
		color: #FFFFFF;
	}
	.user_phone{
		font-size: 26rpx;
		font-family: SourceHanSansCN;
		font-weight: 400;
		color: #FFFFFF;
	}
	.code{
		width: 35rpx;
		height: 35rpx;
	}
	.user_code{
		font-size: 28rpx;
		font-family: SourceHanSansCN;
		font-weight: 400;
		color: #FFFFFF;
		margin-left: 15rpx;
	}
	
}
.wrap{
	position: absolute;
	top: 250rpx;
	left: 0;
	right: 0;
	.list{
		border-bottom: 1rpx solid #f8f8f8;
		height: 80rpx;
		.icon{
			width:40rpx;
			height:40rpx;
		}
		.list_name{
			font-size: 28rpx;
			font-family: SourceHanSansCN;
			font-weight: 400;
			color: #676767;
		}
		.right_icon{
			width: 38rpx;
			height: 38rpx;
		}
	}
	.wrap_title{
		font-size: 30rpx;
		font-family: SourceHanSansCN;
		font-weight: 400;
		color: #CA9A4D;
	}
	.wrap_pay{
		width: 152rpx;
		height: 41rpx;
		line-height: 41rpx;
		text-align: center;
		background: #2E4E7E;
		border-radius: 21rpx;
		font-size: 26rpx;
		font-family: SourceHanSansCN;
		font-weight: 400;
		color: #FFFFFF;
	}
	.tag_img{
		width:70rpx;
		height: 70rpx;
		display: block;
		margin: 0 auto;
	}
	.tagName{
		height: 60rpx;
		line-height: 60rpx;
		text-align: center;
		font-size: 28rpx;
		font-family: SourceHanSansCN;
		font-weight: 400;
		color: #626262;
	}
}
</style>
